<script setup lang="ts">
import {onMounted, ref} from 'vue'
import axios from "axios";
import router from "@/router";
import {useLoginStore} from '../store/useLoginStore.ts'
import { ElMessage } from "element-plus"

onMounted(()=>{
  useLoginStore().isLogin = true;
})

const username = ref('')
const password = ref('')
const login = () => {
  const loginData = {
    username: username.value,
    password: password.value
  };
  console.log(loginData);
  axios.post('http://localhost:8080/user/merchantLogin', loginData).then(res => {
    if (res.data.code === 200) {
      const merchantAccount = res.data.data[0];
      switch (merchantAccount.isExamine) {
        case 0:
          ElMessage.error('您的账号正在审核，请耐心等待');
          break;
        case 1:
          ElMessage.success('登录成功');
          useLoginStore().isLogin = true;
          router.push('/');
          break;
        case 2:
          ElMessage.error('您的账号未通过审核，请联系管理员');
          useLoginStore().isLogin = true;
          useLoginStore().merchants=res.data.data;
          router.push('/repost');
          console.log(useLoginStore().merchants);
          break;
      }
    } else {
      ElMessage.error('登录失败');
    }
  });
};


const register=()=>{
  router.push('/register')
}
</script>

<template>
  <div class="container">
    <h1>登录</h1>
    <el-input v-model="username" style="width: 240px" placeholder="用户名" />
    <el-input v-model="password" style="width: 240px" type="password" placeholder="密码" show-password />
    <div>
      <el-button type="primary" @click="login">登录</el-button>
      <el-button type="primary" @click="register">商铺入住</el-button>
    </div>

  </div>
</template>

<style scoped>
.container {
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

h1 {
  font-size: 24px;
  margin-bottom: 20px;
  color: #333;
}
</style>